<!DOCTYPE html> 
<html>
<head>
	<title></title>
    <meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<link rel="stylesheet" href="libs/jquery.mobile-1.4.4/jquery.mobile-1.4.4.min.css" />

    <script data-main="js/app" src="libs/iscroll-4.2.5/iscroll.js"></script>
    <script data-main="js/app" src="libs/requirejs/require.js"></script>
    <script type="text/javascript" src="phonegap.js"></script>
    <link rel="stylesheet" type="text/css" href="libs/css/www.css" />


</head>

<body>

<!--logon页面-->
    <div data-role="page" id="logon" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
		<div id="pre_loading_checkbox_sel" class="sel" style="display:none"></div>
		<div id="pre_loading_filter_on" class="filterOn" style="display:none"></div>
		<div id="pre_loading_confirm_ok" class="confirm_ok" style="display:none"></div>
        <div id="loading_page" style="position: absolute; width: 100%; height: 100%; background: white; z-index: 999;"></div>
        <div data-role="header" style="width: 100%;background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
            <div id="title_logon_on" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: auto;text-shadow: none">Log on</div>
            <div id="btn_logon_infomation" class="ui-btn-right infor" style="width:38px;height:38px;top: 0px"></div>
        </div>
        <div id="logon_content" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
            <div>
                <div style="padding: 10px">
                    <ul data-role="listview" data-inset="true" style="margin: 0px;border-radius:0px">
                        <li style="border: 0px;padding: 0px">
                            <div style="width: 100%" ><img class="logon_title" src=""  style="width: 100%;height: 129px" alt=""/></div>
                        </li>
                        <li style="border: 0px;padding: 0px">
                            <div style="margin: 10px">
                                <div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Username</div>
                                <input data-role="none" type="text" class="input" id="logon_txt_username" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                            </div>
                            <div style="margin: 10px">
                                <div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Password</div>
                                <input data-role="none" type="password" class="input" id="logon_txt_password"  style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                            </div>
                        </li>
                        <li style="border: 0px;padding: 0px">
                            <div style="margin: 10px">
                                <button id="btn_logon" href="#newsroom" data-transition="slide" style="background-color: #a3d963;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">Log On</button>
                            </div>
                        </li>
                        <li style="border: 0px;padding: 10px;padding-bottom: 15px">
                            <div style="margin: 10px 0px">
                                <a id="scanQRCode" href="javascript:void(0);" style="text-decoration:none">
									<span style="font-family: Arial;font-size: 14px;font-weight: normal;color: #404040">
                                    Not activated yet?
                                </span>
                                    <span class="right_chevron" style="margin: -10px 4px;height: 29px;display:inline-block;width:10%"/>
                                </a>
                            </div>
                            <div style="margin: 24px 0px">                               
                                <a href="javascript:$.mobile.newChangePage('#logon_help', { transition: 'slide',reverse: false,changeHash: false})" data-transition="slide" data-inline="true" style="text-decoration:none">
									<span style="font-family: Arial;font-size: 14px;font-weight: normal;color: #404040">
                                    Problems logging on?
									</span>
                                    <span class="right_chevron" style="margin: -10px 4px;height: 29px;display:inline-block;width:10%"/>
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

	<div data-role="page" id="page_reset_password" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="forgot_btn_back" class="ui-btn-left back" style="width:38px;height:38px;top: 0px"></div>
        <div id="title_reset_password" style="overflow: visible;color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">Reset password</div>
        <div id="forgot_btn_question" class="ui-btn-right help" style="width:38px;height:38px;top: 0px"></div>
    </div>

    <!--内容-->
	<div id="forgot_password_content" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
		<div style="width: 94%; height:auto; margin: 10px auto 10px auto;">
			<ul id="forgot_password_now" data-role="listview" style="margin: 0px;">
				<li style="width:100%;  padding: 0; border: none;">
					<!--标题图-->
					<div>
						<img class="activation_title" src="" alt="" style="display: block; padding: 0px; width:100%; height:129px; background-size: auto 129px;" />
					</div>
				</li>
				<!--<li style="border: none;padding: 0px;">
					<div style="padding: 10px">
						<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Username</div>
						<input data-role="none" id="forgot_txt_username" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px;"/>
					</div>
				</li>-->
				<li style="border: none;padding: 0px;padding-top: 15px">
					<!--密码-->
					<div style="padding: 0px 10px">
						<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Set your password</div>
						<input data-role="none" id="forgot_pass_password" type="password" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
					</div>
				</li>
				<li style="border: none;padding: 0px;">
					<!--确认密码-->
					<div style="padding: 10px">
						<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Confirm your password</div>
						<input data-role="none" id="forgot_pass_sec_password" type="password" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
					</div>
				</li>
				<li style="border: none;padding: 0px;">
					<!--激活按钮-->
					<div style="padding: 10px">
						<button id="btn_reset_password" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
							OK
						</button>
					</div>
				</li>
			</ul>
			<ul id="forgot_password_success" data-role="listview" style="margin: 0px;display: none">
				<li style="width:100%;  padding: 0; border: none;">
					<!--标题图-->
					<div>
						<img class="activation_title" src="" alt="" style="display: block; padding: 0px; width:100%; height:129px; background-size: auto 129px;" />
					</div>
				</li>
				<li style="width:100%;  padding: 0; border: none;">
					<div style="border: solid 1px rgb(223,223,223);padding: 10px 10px 10px 3px;overflow: auto;margin: 10px">
						<div class="confirm_ok" style="float: left;display: inline;height: 38px;width: 38px">

						</div>
						<div style="display: inline;white-space: normal">
							Your password has been changed successfully.
						</div>
					</div>
				</li>
				<li style="border: none;padding: 0px;">
					<!--激活按钮-->
					<div style="padding: 10px">
						<button id="btn_forgot_logonNow" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
							Log On Now
						</button>
					</div>
				</li>
			</ul>

		</div>
	</div>

	</div>
	
	<div data-role="page" id="page_change_device" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="device_btn_back" class="ui-btn-left back" style="width:38px;height:38px;top: 0px"></div>
        <div id="title_change_divice" style="overflow: visible;color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">Device change</div>
        <div id="device_btn_question" class="ui-btn-right help" style="width:38px;height:38px;top: 0px"></div>
    </div>

    <!--内容-->
	<div id="change_device_content" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
		<div style="width: 94%; height:auto; margin: 10px auto 10px auto;">
			<ul id="device_change_success" data-role="listview" style="margin: 0px">
				<li style="width:100%;  padding: 0; border: none;">
					<!--标题图-->
					<div>
						<img class="activation_title" src="" alt="" style="display: block; padding: 0px; width:100%; height:129px; background-size: auto 129px;" />
					</div>
				</li>
				<li style="width:100%;  padding: 0; border: none;">
					<div style="border: solid 1px rgb(223,223,223);padding: 10px 10px 10px 3px;overflow: auto;margin: 10px">
						<div class="confirm_ok" style="float: left;display: inline;height: 38px;width: 38px">

						</div>
						<div style="display: inline;white-space: normal">
							Thank you! Your account has been activated on this device.
						</div>
					</div>
				</li>
				<li style="border: none;padding: 0px;">
					<!--激活按钮-->
					<div style="padding: 10px">
						<button id="btn_device_logonNow" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
							Log On Now
						</button>
					</div>
				</li>
			</ul>

		</div>
	</div>

	</div>
	
<!--activation页面-->
    <div data-role="page" id="page_activation" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="active_btn_back" class="ui-btn-left back" style="width:38px;height:38px;top: 0px"></div>
        <div id="title_active" style="overflow: visible;color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">User account activation</div>
        <div id="active_btn_question" class="ui-btn-right help" style="width:38px;height:38px;top: 0px"></div>
    </div>

    <!--内容-->
    <div id="active_content" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div style="width: 94%; height:auto; margin: 10px auto 10px auto;">
            <ul id="active_registe_now" data-role="listview" style="margin: 0px;">
                <li style="width:100%;  padding: 0; border: none;">
                    <!--标题图-->
                    <div>
                        <img class="activation_title" src="" alt="" style="display: block; padding: 0px; width:100%; height:129px; background-size: auto 129px;" />
                    </div>
                </li>
                <li style="border: none;padding: 0px;padding-top: 15px">
                    <!--激活码-->
                    <div style="padding: 0px 10px">
                        <div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Staff ID</div>
                        <input data-role="none" id="active_txt_code" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #999999;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                    </div>
                </li>
                <li style="border: none;padding: 0px;">
                    <!--用户名-->
                    <div style="padding: 10px">
                        <div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Username</div>
                        <input data-role="none" id="active_txt_username" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px;"/>
                    </div>
                </li>
                <li style="border: none;padding: 0px;">
                    <!--密码-->
                    <div style="padding: 0px 10px">
                        <div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Set your password</div>
                        <input data-role="none" id="active_pass_password" type="password" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                    </div>
                </li>
                <li style="border: none;padding: 0px;">
                    <!--确认密码-->
                    <div style="padding: 10px">
                        <div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Confirm your password</div>
                        <input data-role="none" id="active_pass_sec_password" type="password" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                    </div>
                </li>
                <li style="border: none;padding: 0px;">
                    <!--同意团队信息-->
                    <div style="padding: 10px">
                        <div style="display: -webkit-flex; display: flex;
                        position:relative;
                        height:44px; ">
                            <div style="position:relative; margin: auto auto auto 0px;font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;white-space: normal">
                                I have read and accept the Terms and Conditions of this app.
                            </div>
                            <div id="checkbox_active_agree" class="nor" style="position:relative; margin: auto auto auto 0px;padding: 0px 10px 0px 0px; float:left;background-repeat: no-repeat">

                            </div>
                            <div style="clear: left"></div>
                        </div>
                    </div>
                </li>
                <li style="border: none;padding: 0px;">
                    <!--激活按钮-->
                    <div style="padding: 10px">
                        <button id="btn_active" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
                            Activate Now
                        </button>
                    </div>
                </li>
            </ul>
            <ul id="activity_success" data-role="listview" style="margin: 0px;display: none">
                <li style="width:100%;  padding: 0; border: none;">
                    <!--标题图-->
                    <div>
                        <img class="activation_title" src="" alt="" style="display: block; padding: 0px; width:100%; height:129px; background-size: auto 129px;" />
                    </div>
                </li>
                <li style="width:100%;  padding: 0; border: none;">
                    <div style="border: solid 1px rgb(223,223,223);padding: 10px 10px 10px 3px;overflow: auto;margin: 10px">
                        <div class="confirm_ok" style="float: left;display: inline;height: 38px;width: 38px">

                        </div>
                        <div style="display: inline;white-space: normal">
                            Thank you! Your account has been activated on this device.
                        </div>
                    </div>
                </li>
                <li style="border: none;padding: 0px;">
                    <!--激活按钮-->
                    <div style="padding: 10px">
                        <button id="btn_active_logonNow" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
                            Log On Now
                        </button>
                    </div>
                </li>
            </ul>

        </div>
    </div>

</div>

	<div data-role="page" id="page_multipulte_img" style="background:grey">
		<div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: block;border: 1px solid rgb(242, 102, 71);">
			<div class="ui-btn-left back btn_back" style="width:38px;height:38px;top: 0px"></div>
			<div id="title_multipulte_img" style="overflow: visible;color: #ffffff;margin-top: 8px;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none;text-align:center">Photos</div>
		</div>

		<div class="carosule">
			<div class="vertical-middle">
			  <div class="pic-show" style="left:0">
			  </div>
		  </div>
		</div>
		<div class="pic-num"></div>
	</div>

<!--Question-->
<div data-role="page" id="page_question" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_question" style="color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">Terms of services</div>
        <img id="btn_question_turn_back" src="images/icon_chevron_left_white.png" alt="" class="ui-btn-left" style="width:23px;height:23px;margin:5px 5px">
    </div>
    <div id="question_content_static" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <div style="padding: 10px">
                <ul id="question_ul" data-role="listview" data-inset="true" style="margin: 0px;border-radius: 0px;background-color: #ffffff">
                    <li style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                                WELCOME
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               Thanks for using our products and services (“Services”). The Services are provided by HSDC (HSBC Software Development (GD) Limited).
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               By using our Services, you are agreeing to these terms. Please read them carefully.
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                              Our Services are very diverse, so sometimes additional terms or product requirements (including age requirements) may apply. Additional terms will be available with the relevant Services, and those additional terms become part of your agreement with us if you use those Services.
                            </div>
                            <div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               YOUR ACCOUNT
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                             If you use any HSDC Services, you are responsible for maintaining the confidentiality of your account and password and for restricting access to your devices, and you agree to accept responsibility for all activities that occur under your account or password.
                            </div>
                            <div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               USING OUR SERVICES
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                              You must follow any policies made available to you within the Services.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 Don’t misuse our Services. For example, don’t interfere with our Services or try to access them using a method other than the interface and the instructions that we provide. You may use our Services only as permitted by law, including applicable export and re-export control laws and regulations. We may suspend or stop providing our Services to you if you do not comply with our terms or policies or if we are investigating suspected misconduct.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 Using our Services does not give you ownership of any intellectual property rights in our Services or the content you access. You may not use content from our Services unless you obtain permission from its owner or are otherwise permitted by law. These terms do not grant you the right to use any branding or logos used in our Services. Don’t remove, obscure, or alter any legal notices displayed in or along with our Services.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                              Our Services display some content that is not HSDC’s. This content is the sole responsibility of the entity that makes it available. We may review content to determine whether it is illegal or violates our policies, and we may remove or refuse to display content that we reasonably believe violates our policies or the law. But that does not necessarily mean that we review content, so please don’t assume that we do.
                            </div>
							 <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                              In connection with your use of the Services, we may send you service announcements, administrative messages, and other information. You may opt out of some of those communications.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 Our Services are available on mobile devices. Do not use such Services in a way that distracts you and prevents you from obeying traffic or safety laws.
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                              PRIVACY
                            </div>
							 <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                             Please review our Privacy Notice, which also governs your use of HSDC Services, to understand our practices.
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                             COPYRIGHT
                            </div>
							 <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                             All content included in or made available through any HSDC Services, such as text, graphics, logos, button icons, images, audio and video clips, digital downloads, and data compilations is the property of HSDC or its content suppliers and protected by China and international copyright laws. The compilation of all content included in or made available through any HSDC Service is the exclusive property of HSDC and protected by China and international copyright laws.
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                             COPYRIGHT COMPLAINTS
                            </div>
							 <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                            HSDC respects the intellectual property of others. If you believe that your work has been copied in a way that constitutes copyright infringement, please contact us.
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                              DISCLAIMER OF WARRANTIES AND LIMITATION OF LIABILITY
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 The HSDC Services and all information, content, materials, products (including software) and other services included on or otherwise made available to you through the HSDC Services are provided by HSDC on an "as is" and "as available" basis, unless otherwise specified in writing. HSDC makes no representations or warranties of any kind, express or implied, as to the operation of the HSDC Services, or the information, content, materials, products (including software) or other services included on or otherwise made available to you through the HSDC Services, unless otherwise specified in writing. You expressly agree that your use of the HSDC Services is at your sole risk.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							To the full extent permissible by applicable law, HSDC disclaims all warranties, express or implied, including, but not limited to, implied warranties of merchantability and fitness for a particular purpose. HSDC does not warrant that the HSDC Services, information, content, materials, products (including software) or other services included on or otherwise made available to you through the HSDC Services, HSDC’s servers or electronic communications sent from HSDC are free of viruses or other harmful components. HSDC will not be liable for any damages of any kind arising from the use of any HSDC service, or from any information, content, materials, products (including software) or other services included on or otherwise made available to you through any HSDC service, including, but not limited to direct, indirect, incidental, punitive, and consequential damages, unless otherwise specified in writing.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 Certain state laws do not allow limitations on implied warranties or the exclusion or limitation of certain damages. If these laws apply to you, some or all of the above disclaimers, exclusions, or limitations may not apply to you, and you might have additional rights.
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--ChangePassword页面-->
<div data-role="page" id="forgetPassword" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_change_password" style="color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">Change password</div>
        <div  id="change_back" class="ui-btn-left back" style="width:38px;height:38px;top: 0px"></div>
    </div>
    <div id="change_forget_content" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <div style="padding: 10px">
                <ul id="changePassword_ul" data-role="listview" data-inset="true" style="margin: 0px;border-radius: 0px;background-color: #ffffff;">
                    <li style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="margin-bottom: 10px;font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;">
                                Current password
                            </div>
                            <input data-role="none" id="change_password-txt-currentPassword" type="password" style="height: 44px;width: 100%;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                        </div>
                    </li>
                    <li style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="margin-bottom: 10px;font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;">
                                New password
                            </div>
                            <input data-role="none" id="change_password-txt-newPassword" type="password" style="height: 44px;width: 100%;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                        </div>
                    </li>
                    <li style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="margin-bottom: 10px;font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;">
                                Confirm new password
                            </div>
                            <input data-role="none" id="change_password-txt-newPassword-confirm" type="password" style="height: 44px;width: 100%;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>
                        </div>
                    </li>
                    <li style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <button id="change_password-btn" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">OK</button>

                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--ForgetPassword页面-->
<div data-role="page" id="forgetPassword_static" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_forgot_password" style="color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">Forgot password</div>
        <img  id="turn_back" src="images/icon_chevron_left_white.png" alt="" class="ui-btn-left" style="width:23px;height:23px;margin:5px 5px">
    </div>
    <div id="forget_content_static" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll">
        <div>
            <div style="padding: 10px">
                <ul data-role="listview" data-inset="true" style="margin: 0px;border-radius: 0px;">
                    <li id="static_li" style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                                If you have forgotten your log on password, please follow the instructions below to reset your password:
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               1) Visit and log on to the <strong>#red Help Center</strong> in the intranet
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                                2) Click on "Forgot Password" and get a verification QR code there. 
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               When you got the QR code ready, click the following button to continue. 
                            </div>
                        </div>
						<div style="margin: 10px">
							<button id="btn_forgot_password" data-transition="slide" style="background-color: #a3d963;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none" class=" ui-btn ui-shadow ui-corner-all">Reset my password now</button>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--changed a new device-->
<div data-role="page" id="changed_device" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_device_change" style="color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none;">Device change</div>
        <img  id="changeDevice_turn_back" src="images/icon_chevron_left_white.png" alt="" class="ui-btn-left" style="width:23px;height:23px;margin:5px 5px">
    </div>
    <div id="changeDevice_content" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <div style="padding: 10px">
                <ul data-role="listview" data-inset="true" style="margin: 0px;border-radius: 0px;background-color: #ffffff;">
                    <li id="changeDevice_li" style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               #red can only be activated on one device at a time. If you have changed your device and wish to activate it, here are the steps to follow.
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                                1) Visit and log on to the <strong>#red Help Center</strong> in the intranet
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                                2) Click on "Device Change" and get a new Activation QR code there.
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                                When you got the QR code ready, click the following button to continue.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               Remember, once your new device is activated, you won't be able to access #red from the old device. 
                            </div>
                        </div>
						<div style="margin: 10px">
							<button id="btn_change_device" data-transition="slide" style="background-color: #a3d963;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none" class=" ui-btn ui-shadow ui-corner-all">Active my new device now</button>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!-- Help -->
<div data-role="page" id="logon_help" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_help" style="color: #ffffff;margin: 8px auto auto auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none;text-align: center;">Help</div>
        <img  id="help_turn_back" src="images/icon_chevron_left_white.png" alt="" class="ui-btn-left" style="width:23px;height:23px;margin:5px 5px">
    </div>
    <div id="logon_help_content" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <div style="padding: 10px">
                <ul id="help_li" data-role="listview" data-inset="true" style="margin: 0px;border-radius: 0px;background-color: #ffffff">
                    <li style="border: 0px;padding: 0px">
                        <a id="help_forgetPassword" style="border-top:none;border-left: none;border-right: none;height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" href="#">Forgot your password<span class="right_chevron" style="float: right;display: inline-block;width: 10%;height: 27px;margin-top: -7px;"></span></a>
                    </li>
                    <li style="border: 0px;padding: 0px">
                        <a id="help_changeDevice" style="border-left: none;border-right: none;height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" href="#">Changed a new device<span class="right_chevron" style="float: right;display: inline-block;width: 10%;height: 27px;margin-top: -7px;"></span></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--Infomation页面-->
<div data-role="page" id="infomation" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_infomation" style="color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">About this app</div>
        <img id="btn_infomation_turn_back" src="images/icon_chevron_left_white.png" alt="" class="ui-btn-left" style="width:23px;height:23px;margin:5px 5px">
    </div>
    <div id="infomation_content_static" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <div style="padding: 10px">
                <ul id="information_ul" data-role="listview" data-inset="true" style="margin: 0px;border-radius: 0px;background-color: #ffffff;">
                    <li style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;font-size: 12px;font-family: Arial;margin: 15px 0px;">
                                <strong>#red</strong> is an amazing mobile app designed and made specially for you at GLTc! It helps you stay informed with what’s happening in our workplace whenever you are and wherever you are! 
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;font-size: 12px;font-family: Arial;margin: 15px 0px;">
								With #red, you no longer need to worry about missing the fantastic opportunities from Trade Union or CS, or forgetting to read about the stories around you! With #red, we provide you a robust and modern experience of corporate life!
							</div>
							<ul style="list-style:disc;margin-left:-25px">
								<li style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
									<span style="font-weight: bold">Super rich contents</span> – A centralized channel to simplify internal communication
								</li>
								<li style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
									<span style="font-weight: bold">Activities at fingertip</span> – Sign up for activities right away from your smartphone
								</li>
								<li style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
									<span style="font-weight: bold">Two way communication</span> – Share your feedbacks by quick surveys
								</li>
								<li style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
									<span style="font-weight: bold">Timely notification</span> – Top-notch technologies to keep you informed in time
								</li>
								<li style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
									<span style="font-weight: bold">Other superb features</span> – Discover the offices with a brand new experience and see the workplace in a different way
								</li>
								<li style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
									<span style="font-weight: bold">Infinitive possibilities</span> – More features are on the way shortly in 2015.. Stay tuned!
								</li>
							</ul>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;font-size: 12px;font-family: Arial;margin: 15px 0px;">
								#red is brought to you by the GLTc Mobile team and powered by ‘TouchTop’ the Staff Mobile Platform.
							</div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;font-size: 12px;font-family: Arial;margin: 15px 0px;">
								#red is the one and only app you’ll ever need! So what are you still you waiting for? Just #red it now!
							</div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--newsroom页面-->
<div data-role="page" id="newsroom" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div id="newsroom_header" data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="newsroom_header_title" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: auto;text-shadow: none">Newsroom</div>
        <div id="newsroom_btn_menu" class="ui-btn-left menu" style="width:38px;height:38px;top: 0px"></div>
        <div id="newsroom_header_buttons">
            <div id="newsroom_btn_filter" data-direction="slider" class="ui-btn-right filter" style="width:38px;height:38px;top: 0px;margin-right: 40px"></div>
            <div id="new_search" class="ui-btn-right search" style="width:38px;height:38px;top: 0px"></div>
        </div>
    </div>
    <!--内容-->
    <!-- Nick removed for pull to refresh start
    <div id="news_content" data-role="content" style="width:94%; margin:0 auto;  padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
    Nick removed for pull to refresh end -->
    <!-- Nick added for pull to refresh start -->
    <div id="news_content" data-role="content" style="width:94%; margin:0 auto;  padding: 0px;height: 0px;">
        <div id="news_wrapper" class="wrapper">
            <div class="scroller">
                <div id="pullDown">
                    <span id="pullDownIcon" class="pullDownIcon"></span>
                    <span id="pullDownLabel" class="pullDownLabel">Pull down to refresh...</span>
                </div>
    <!-- Nick added for pull to refresh end -->
            <ul id="newsroom_listview_news" data-role="listview" data-inset="true" style="margin: 10px 0px;border-radius: 0px"></ul>
            <!-- Nick added for pull to refresh start -->
                <div id="pullUp" style="display: none;">
                    <span id="pullUpIcon" class="pullUpIcon"></span>
                    <span id="pullUpLabel" class="pullUpLabel">Pull up to load more...</span>
                </div>
            </div>
            <!-- Nick added for pull to refresh end -->
        </div>
    </div>
    <!--push推出-->
    <div data-role="panel" id="panel_menu" data-position="left" data-display="overlay" style="width: 100%;background-color: rgba(0,0,0,0)">
        <div  id="push_ul" style="" >
            <div style="float: left;width: 85%">
                <ul data-role="listview" style="background-color: #f26647;">
                    <li style="background-color: #f26647;color: #ffffff;padding: 12px 0px 32px 15px;height: 82px;">
                        <div>
                            <div class="push_title"></div>
                        </div>
                        <span style="font-family: Arial;font-size: 12px;font-weight: normal;text-shadow: none">Welcome, <span id="push_username" style="text-shadow: none"></span></span>
                    </li>
                    <li id="push_newsroom" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_newsroom" style="width: 38px;height: 38px;margin-top:7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Newsroom</span>
                            </div>
                        </div>
                    </li>
                    <li id="push_activities" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px;">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_activities" style="width: 38px;height: 38px;margin-top: 7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Activities</span>
                            </div>
                        </div>
                    </li>
					<li id="push_AR" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_discovery" style="width: 38px;height: 38px;margin-top:7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Discovery</span>
                            </div>
                        </div>
                    </li>
					<li id="push_Laisee" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_mylaisee" style="width: 38px;height: 38px;margin-top:7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Green Laisee</span>
                            </div>
                        </div>
                    </li>
                    <li id="push_setting" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_settings" style="width: 38px;height: 38px;margin-top: 7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Settings</span>
                            </div>
                        </div>
                    </li>
                    <li id="auto_height" style="background-color: #f26647;color: #ffffff;padding: 25px 0px 25px 0px">

                    </li>
                    <li id="push_logon" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 64px" >
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;display:-webkit-flex;display:flex;">
                                <div class="push_logOff" style="width: 38px;height: 38px;margin-top: 12px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%;height:100%;display:-webkit-flex;display:flex;">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;margin:auto 0px;text-shadow: none">Log off</span>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="push_nees_opacity" style="float: right;width: 15%;background-color: rgba(0,0,0,0.5)">

            </div>
        </div>
    </div>
</div>

<!--setting页面-->
<div data-role="page" id="setting" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_settings" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: auto;text-shadow: none">Settings</div>
        <div id="setting_btn_menu" class="ui-btn-left menu" style="width:38px;height:38px;top: 0px"></div>
    </div>

    <!--内容-->
    <div id="setting_content" data-role="content" style="width:94%; margin:0 auto; height:0px; padding: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <ul id="setting_ul" data-role="listview" data-inset="true" style="margin: 10px 0px;border-radius: 0px;background-color: #ffffff;">
                <!--<li style="height: 30px;padding: 5px 10px;background-color: #8d7c81;color: #ffffff;display: -webkit-flex;display: flex">
                    <span style="font-size: 12px;font-family: Arial;margin: auto 0px;font-weight: bold;text-shadow: none">PREFERENCES</span>
                </li>
                <li style="">
                    <a class="ui-icon-carat-l" style="opacity: 0.3;height: 67px;padding: 9px 10px;font-family:Arial;font-size: 14px;font-weight: normal;" href="#">
                        Display language
                        <br/> <span style="font-weight: bold;font-size: 14px">English</span>
                    </a>
                </li>-->
                <li style="height: 30px;padding: 5px 10px;background-color: #8d7c81;color: #ffffff;display: -webkit-flex;display: flex">
                    <span style="font-size: 12px;font-family: Arial;margin: auto 0px;font-weight: bold;text-shadow: none">ACCOUNT</span>
                </li>
                <li>
                    <a id="btn_setting_changePW" style="height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" data-transition="slide" href="#">Change password<span class="right_chevron" style="float: right;display: inline-block;width: 10%;height: 27px;margin-top: -7px;"></span></a>
                </li>
                <!--<li>-->
                    <!--<a style="opacity: 0.3;height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" href="#">Change facial recognition image</a>-->
                <!--</li>-->
                <li style="height: 30px;padding: 5px 10px;background-color: #8d7c81;color: #ffffff;display: -webkit-flex;display: flex">
                    <span style="font-size: 12px;font-family: Arial;margin: auto 0px;font-weight: bold;text-shadow: none">SUPPORT</span>
                </li>
                <li>
                    <a id="btn_setting_about" style="height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" href="#">About this app<span class="right_chevron" style="float: right;display: inline-block;width: 10%;height: 27px;margin-top: -7px;"></span></a>
                </li>
                <li>
                    <a id="btn_setting_question" style="height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" href="#">Terms of services<span class="right_chevron" style="float: right;display: inline-block;width: 10%;height: 27px;margin-top: -7px;"></span></a>
                </li>
                <li>
                    <a id="btn_setting_policy" style="height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" href="#">Privacy policy<span class="right_chevron" style="float: right;display: inline-block;width: 10%;height: 27px;margin-top: -7px;"></span></a>
                </li>
                <li>
                    <a style="height: 47px;padding: 13px 10px;font-family:Arial;font-size: 14px;font-weight: normal" href="mailto:red.support.gltc@hsbc.com.cn">Report a problem<span class="right_chevron" style="float: right;display: inline-block;width: 10%;height: 27px;margin-top: -7px;"></span></a>
                </li>
            </ul>
        </div>

    </div>

    <!--setting页面push推出-->
    <div data-role="panel" id="setting_panel_menu" data-position="left" data-display="overlay" style="width: 100%;background-color: rgba(0,0,0,0)">
        <div style="float: left;width: 85%">
            <ul id="setting_push_ul" data-role="listview" style="background-color: #f26647">
                <li style="background-color: #f26647;color: #ffffff;padding: 12px 0px 32px 15px;height: 82px;">
                    <div>
                        <div class="push_title"></div>
                    </div>
                    <span style="font-family: Arial;font-size: 12px;font-weight: normal;text-shadow: none">Welcome, <span id="setting_push_username" style="text-shadow: none"></span></span>
                </li>
                <li id="setting_push_newsroom" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_newsroom" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Newsroom</span>
                        </div>
                    </div>
                </li>
                <li id="setting_push_activities" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_activities" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Activities</span>
                        </div>
                    </div>
                </li>
				<li id="setting_push_AR" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_discovery" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Discovery</span>
                        </div>
                    </div>
                </li>
                <li id="setting_push_Laisee" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_mylaisee" style="width: 38px;height: 38px;margin-top:7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Green Laisee</span>
                        </div>
                    </div>
                </li>
                <li id="setting_push_setting" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_settings" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Settings</span>
                        </div>
                    </div>
                </li>
                <li id="setting_auto_height" style="background-color: #f26647;color: #ffffff;padding: 25px 0px 25px 0px">

                </li>
                <li id="setting_push_logon" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 64px" >
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_logOff" style="width: 38px;height: 38px;margin-top: 12px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%;height:100%;display:-webkit-flex;display:flex;">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;margin:auto 0px;text-shadow: none">Log off</span>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="push_nees_opacity" style="float: right;width: 15%;background-color: rgba(0,0,0,0.5)">

        </div>
    </div>

</div>

<!--Policy-->
<div data-role="page" id="page_policy" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_policy" style="color: #ffffff;margin: auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none">Privacy policy</div>
        <img id="btn_policy_turn_back" src="images/icon_chevron_left_white.png" alt="" class="ui-btn-left" style="width:23px;height:23px;margin:5px 5px">
    </div>
    <div id="policy_content_static" data-role="content" style="padding: 0px;height: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <div style="padding: 10px">
                <ul id="policy_ul" data-role="listview" data-inset="true" style="margin: 0px;border-radius: 0px;background-color: #ffffff;">
                    <li style="border: 0px;padding: 0px">
                        <div style="margin: 10px">
                            <div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                                Privacy Policy
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               Your privacy is very important information for #red. Therefore, we developed a Privacy Policy that covers how we collect, use, disclose and store your information. Please take a moment to familiarize yourself with our privacy policy, if you have any questions, please contact us. 
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               What information we will collect 
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                                We collect information in order to provide you with a better service, we collect information mainly from two aspects: 
                            </div>
                            <div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               Information you provide to us
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                              When you log in with your ID in the application, download software updates, we may collect a variety of information, including your name, phone number, e-mail address.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                               When you using #red share content with others, sending a message or inviting others to join in on #red, #red may collect information you provide, such as your name, email address and telephone number. 
                            </div>
                            <div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               Non-personal information when you use 
                            </div>
                            <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                              We may collect device-specific information (such as your hardware model, operating system version, unique device identifiers, and mobile network information including phone number).
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							  When you use location-enabled features and services, we may collect and process information about your actual location. 
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 If we do combine non-personal information with personal information when we use, these combined information will be treated as personal information for as long as it remains combined. 
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               How we use your personal information
                            </div>
							 <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                              Personal information we collect enables us to promptly release the latest version of the #red products, software updates and Events to users.
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 We also use personal information to help us to create, develop, and improve our products, services, content and advertising. 
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 We may use your personal information to send important notices, such as we use to change the terms, conditions and policies. If you participate in sweepstakes, contests or similar promotional activities, we may use the information you provide to manage such activities. 
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               What information we will share
                            </div>
							 <div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
                             We do not share personal information with any company, organizations and individuals other than HSBC Software Development (GD) Limited, unless in the following situations: 
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 If by law, legal process, litigation and/or require from public and government authorities, we may be necessary to disclose your personal information. If in the purposes of national security, law enforcement, or other issues of public importance, the disclosure of information is necessary or appropriate after our confirmation, we will disclose your personal information. 
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 If for the implementation of our terms and conditions or by the purpose of protecting our operations or users, once after our determination that disclosure is reasonable and necessary, we may also disclose your personal information. In addition, in the event of reorganization, merger or sale, and we may forward all personal information we collect to the relevant third party.
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                               Privacy Questions
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 If you have any questions or concerns about #red’s Privacy Policy or data processing, or if you would like to make a complaint about a possible breach of local privacy laws, please contact us. You can always contact us by sending email to Red Support GLTC/HSDC/HSBC or red.support.gltc@hsbc.com.cn.
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                              Changes
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 Our Privacy Policy may change. We will not reduce your rights under this Privacy Policy without your explicit consent. We will post any Privacy Policy changes on this page and, if the changes are significant, we will notify you in details about the changes of Privacy Policy via e-mail. We will also keep prior versions of this Privacy Policy in an archive for your review.
                            </div>
							<div style="white-space: normal;font-weight: bold;line-height: 1.5;font-size: 12px;font-family: Arial">
                              Remarks
                            </div>
							<div style="white-space: normal;font-weight: normal;line-height: 1.5;margin: 15px 0px;font-size: 12px;font-family: Arial">
							 If there is any difference between English and Chinese version, please take English version as standard.
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--Filter页面-->
<div data-role="page" id="filter" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_filter" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: auto;text-shadow: none">Filter</div>
        <div id="filter_btn_menu" alt="" class="ui-btn-left menu" style="width:38px;height:38px;top: 0px"></div>
        <span id="filter_btn_applay" class="ui-btn-right" style="font-family: Arial;margin: auto;padding: 8px;font-size: 14px;color: #ffffff;font-weight: normal;text-shadow: none;">Apply</span>
    </div>

    <!--内容-->
    <div id="filter_content" data-role="content" style="width:100%; height:0px; padding: 0px;margin: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <ul id="newsFilter_ul" data-role="listview" data-inset="true" style="border-radius: 0px;margin: 0px;background-color: #ffffff;">
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-a" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="font-family: Arial;font-size: 15px;width: 87%;height: auto;margin: auto;padding-left: 18%">
                            All
                        </div>
                        <div class="ui-block-b" style="width: 13%;height: auto;margin-top: 0px;">
                            <div id="all_check" name="sbox2" class="nor">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #6699c2;">COMM</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Communications
                            </div>
                        </div>
                        <div class="ui-block-c ui-checkbox" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Communications">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #a3d963;">CS</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Corporate Sustainability
                            </div>
                        </div>
                        <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Corporate Sustainability">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #e8e012;">FIN</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Finance
                            </div>
                        </div>
                        <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Finance">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #a3bdad;">GTU</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Trade Union
                            </div>
                        </div>
                        <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Trade Union">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #e6b012;">HR</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Human Resources
                            </div>
                        </div>
                        <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Human Resources">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #75c2bd;">INNO</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Innovation
                            </div>
                        </div>
                        <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Innovation">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #8d7c81;">OPS</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Center Operations
                            </div>
                        </div>
                        <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Center Operations">
                            </div>
                        </div>
                    </div>
                </li>
                <li style="padding: 0px;height: 40px;">
                    <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                        <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                            <div class="filter_tags" style="background-color: #7a77ae;">TD</div>
                        </div>
                        <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                            <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                                Technical Development
                            </div>
                        </div>
                        <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                            <div name="sbox" class="nor" alt="Technical Development">
                            </div>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>

    <!--filter页面push推出-->
    <div data-role="panel" id="filter_panel_menu" data-position="left" data-display="overlay" style="width: 100%;background-color: rgba(0,0,0,0)">
        <div style="float: left;width: 85%">
            <ul id="filter_push_ul" data-role="listview" style="background-color: #f26647">
                <li style="background-color: #f26647;color: #ffffff;padding: 12px 0px 32px 15px;height: 82px;">
                    <div>
                        <div class="push_title"></div>
                    </div>
                    <span style="font-family: Arial;font-size: 12px;font-weight: normal;text-shadow: none">Welcome, <span id="filter_push_username" style="text-shadow: none"></span></span>
                </li>
                <li id="filter_push_newsroom" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_newsroom" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Newsroom</span>
                        </div>
                    </div>
                </li>
                <li id="filter_push_activities" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_activities" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Activities</span>
                        </div>
                    </div>
                </li>
				<li id="filter_push_AR" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_discovery" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Discovery</span>
                        </div>
                    </div>
                </li>
                <li id="filter_push_Laisee" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_mylaisee" style="width: 38px;height: 38px;margin-top:7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Green Laisee</span>
                        </div>
                    </div>
                </li>
                <li id="filter_push_setting" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_settings" style="width: 38px;height: 38px;margin-top: 7px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Settings</span>
                        </div>
                    </div>
                </li>
                <li id="filter_auto_height" style="background-color: #f26647;color: #ffffff;padding: 25px 0px 25px 0px">

                </li>
                <li id="filter_push_logon" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 64px" >
                    <div class="ui-grid-a" style="height:100%;line-height: 52px">
                        <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                            <div class="push_logOff" style="width: 38px;height: 38px;margin-top: 12px"></div>
                        </div>
                        <div class="ui-block-b" style="width: 80%;height:100%;display:-webkit-flex;display:flex;">
                            <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;margin:auto 0px;text-shadow: none">Log off</span>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="push_nees_opacity" style="float: right;width: 15%;background-color: rgba(0,0,0,0.5)">

        </div>
    </div>

</div>

<!--newsroom_detailed页面-->
<div data-role="page" id="newsroom_detailed" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="title_newsroom_details" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: auto;text-shadow: none">Newsroom</div>
        <!--<span id="Newsroom_detailed_btn_menu" class="ui-btn-left" style="margin: auto;padding-left: 2px;font-size: 20px;color: #ffffff;font-weight: normal"><</span>-->
        <img  id="Newsroom_detailed_btn_menu" src="images/icon_chevron_left_white.png" alt="" class="ui-btn-left" style="width:23px;height:23px;margin:5px 5px">

    </div>

    <!--内容-->
    <div id="newsDetail_content" data-role="content" style="width:94%; margin:0 auto; height:0px; padding: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <ul id="newsroom_detailed_listview" data-role="listview" data-inset="true" style="margin: 10px 0px;border-radius: 0px">
                <!--js动态调用界面-->
            </ul>
        </div>

    </div>
</div>

<!--Activities页面-->
<div data-role="page" id="activities" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div id="activities_header" data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="activities_header_title" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: 8px auto auto;text-shadow: none;width: 87px; height: 20px;text-align: center;">Activities</div>
        <div id="activities_btn_menu" class="ui-btn-left menu" style="width:38px;height:38px;top: 0px"></div>
        <div id="activities_header_buttons">
            <div id="activities_btn_filter" data-direction="slider" class="ui-btn-right filter" style="width:38px;height:38px;top: 0px;"></div>
            <!--<div id="activities_user" class="ui-btn-right user" style="width:38px;height:38px;top: 0px"></div>-->
        </div>
    </div>
    <!--内容-->
    <!-- Nick removed for pull to refresh start
    <div id="activities_content" data-role="content" style="width:94%; margin:0 auto;  padding: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
    Nick removed for pull to refresh end -->
    <!-- Nick added for pull to refresh start -->
    <div id="activities_content" data-role="content" style="width:94%; margin:0 auto;  padding: 0px;">
        <div id="activities_wrapper" class="wrapper">
            <div class="scroller">
                <div id="pullDown">
                    <span id="pullDownIcon" class="pullDownIcon"></span>
                    <span id="pullDownLabel" class="pullDownLabel">Pull down to refresh...</span>
                </div>
    <!-- Nick added for pull to refresh end -->
            <ul id="activities_listview_news" data-role="listview" data-inset="true" style="margin: 10px 0px;border-radius: 0px"></ul>
            <!-- Nick added for pull to refresh start -->
                <div id="pullUp" style="display: none;">
                    <span id="pullUpIcon" class="pullUpIcon"></span>
                    <span id="pullUpLabel" class="pullUpLabel">Pull up to load more...</span>
                </div>
            </div>
            <!-- Nick added for pull to refresh end -->
        </div>
    </div>
    <!--push推出-->
    <div data-role="panel" id="activities_panel_menu" data-position="left" data-display="overlay" style="width: 100%;background-color: rgba(0,0,0,0)">
        <div  id="activities_push_ul" style="" >
            <div style="float: left;width: 85%">
                <ul data-role="listview" style="background-color: #f26647;">
                    <li style="background-color: #f26647;color: #ffffff;padding: 16px 0px 32px 15px;height: 82px;">
                        <div>
                            <div class="push_title"></div>
                        </div>
                        <span style="font-family: Arial;font-size: 12px;font-weight: normal;text-shadow: none">Welcome, <span id="activities_push_username" style="text-shadow: none"></span></span>
                    </li>
                    <li id="activities_push_newsroom" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_newsroom" style="width: 38px;height: 38px;margin-top:7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Newsroom</span>
                            </div>
                        </div>
                    </li>
                    <li id="activities_push_activities" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px;">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_activities" style="width: 38px;height: 38px;margin-top: 7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Activities</span>
                            </div>
                        </div>
                    </li>
					<li id="activities_push_AR" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px;">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_discovery" style="width: 38px;height: 38px;margin-top: 7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Discovery</span>
                            </div>
                        </div>
                    </li>
                    <li id="activities_push_Laisee" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_mylaisee" style="width: 38px;height: 38px;margin-top:7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Green Laisee</span>
                            </div>
                        </div>
                    </li>
                    <li id="activities_push_setting" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                                <div class="push_settings" style="width: 38px;height: 38px;margin-top: 7px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Settings</span>
                            </div>
                        </div>
                    </li>
                    <li id="activities_auto_height" style="background-color: #f26647;color: #ffffff;padding: 25px 0px 25px 0px">

                    </li>
                    <li id="activities_push_logon" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 64px" >
                        <div class="ui-grid-a" style="height:100%;line-height: 52px">
                            <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;display:-webkit-flex;display:flex;">
                                <div class="push_logOff" style="width: 38px;height: 38px;margin-top: 12px"></div>
                            </div>
                            <div class="ui-block-b" style="width: 80%;height:100%;display:-webkit-flex;display:flex;">
                                <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;margin:auto 0px;text-shadow: none">Log off</span>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="push_nees_opacity" style="float: right;width: 15%;background-color: rgba(0,0,0,0.5)">

            </div>
        </div>
    </div>
</div>

<!--Activity details-->
<div data-role="page" id="activity_detail" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="activity_details_btn_back" class="ui-btn-left back" style="width:38px;height:38px;top: 0px"></div>
        <div id="activity_details_title_active" style="overflow: visible;color: #ffffff;margin: 8px auto auto auto;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;text-shadow: none;width:77px">Activities</div>
    </div>
    <!--内容-->
    <div id="activities_details_content" data-role="content" style="width:94%; margin:0 auto;  padding: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <ul id="activities_details_listview_news" data-role="listview" data-inset="true" style="margin: 10px 0px;border-radius: 0px">
                <!--js动态创建页面-->
                <!--<li style="border: 0px;padding: 0px;margin-bottom:10px">-->
                    <!--<div>-->
                        <!--<div style="width: 100%">-->
                            <!--<img src="http://itrufeng.com/upload/uploads/6eff8f9b93dbef2bef165eeb46f397f0a7bd0768.jpg" style="width: 100%; height: 129px" alt=""/>-->
                        <!--</div>-->
                        <!--<label style="margin: 10px; font-size: 18px; white-space:normal;color: #404040">Technology Exchange 2014</label>-->
                        <!--<div style="margin: 10px">-->
                            <!--<div style="white-space:normal;font-weight: normal;font-size: 12px;color: #404040">Opening Ceremony</div>-->
                        <!--</div>-->
                        <!--<div style="margin: 10px;font-size: 11px;color: #404040;">-->
                            <!--<span style="display: block">Time: 14:00-17:00</span>-->
                            <!--<span style="display: block">Date: 11 Aug 2014</span>-->
                            <!--<span style="display: block">Venue: 3F.Tower2</span>-->
                        <!--</div>-->
                        <!--<div style="border-bottom: solid 1px;border-bottom-color: #C0C0C0;width: 100%"></div>-->
                        <!--<div style="margin: 15px 10px 10px 10px;width: auto;white-space: normal;">-->
                            <!--<span style="background-color: rgb(76, 176, 170);padding: 3px 10px;width: auto;height: 15px;font-family: Arial;font-size: 10px;color: #ffffff;text-shadow: none;">INFO</span>-->
                        <!--</div>-->
                    <!--</div>-->
                <!--</li>-->
            </ul>
        </div>
    </div>
    <div style="position: fixed;bottom: 0px;padding: 6px;background-color: #ffffff;width: 100%">
        <button id="btn_details_registerNow" href="#newsroom" data-transition="slide" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">Register Now</button>
    </div>
</div>

<!--activity registraion页面-->
<div data-role="page" id="activityRegister" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;width: 100%;border: 1px solid rgb(242, 102, 71);">
            <div id="activityRegister_btn_back" class="ui-btn-left back" style="width:38px;height:38px;top: 0px"></div>
            <div id="activitiesRegiste_header_title" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: 8px auto auto;text-shadow: none;width: 170px; height: 20px; text-align: center;">Activity registration</div>
        </div>
    </div>
    <!--内容-->
    <div id="activityRegister_content" data-role="content" style="padding: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div id="activityRegister_div">
            <ul id="activityRegister_list" data-role="listview" style="width: 94%; height:auto; margin: 10px auto 10px auto;background-color: #ffffff">
                <!--<li style="padding: 0px;">-->
                    <!--<!--标题图-->
                    <!--<div style="width:100%;  padding: 0; border: none;background-color: rgb(101,153,193);">-->
                        <!--<div style="width:100%;padding: 20px 10px 10px 10px">-->
                            <!--<div style="white-space:normal;font-weight: normal;font-size: 18px;color: #ffffff;margin-bottom: 8px">Technology Exchange Opening</div>-->
                            <!--<div style="font-size: 11px;color: #ffffff;line-height: 18px;font-weight: normal">-->
                                <!--<span style="display: block">Start: 14:00,13 Aug 2014</span>-->
                                <!--<span style="display: block">End: 18:00,13 Aug 2014</span>-->
                                <!--<span style="display: block">Venue: Information of the venue</span>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<!--Staff ID-->
                    <!--<div style="border: none;padding: 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Staff ID <span style="color:red;">*</span></div>-->
                        <!--<input data-role="none" id="activityRegister_txt_id" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>-->
                    <!--</div>-->
                    <!--<!--English name-->
                    <!--<div style="border: none;padding: 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">English name <span style="color:#000000;">*</span></div>-->
                        <!--<input data-role="none" id="activityRegister_txt_englishName" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px;"/>-->
                    <!--</div>-->
                    <!--<!--Chinese name-->
                    <!--<div style="border: none;padding: 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Chinese name <span style="color:red;">*</span></div>-->
                        <!--<input data-role="none" id="activityRegister_txt_chineseName" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>-->
                    <!--</div>-->
                    <!--<!--手机号码-->
                    <!--<div style="border: none;padding: 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">Mobile number <span style="color:red;">*</span></div>-->
                        <!--<input data-role="none" id="activityRegister_txt_mobileNumber" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>-->
                    <!--</div>-->
                    <!--<!--ID number-->
                    <!--<div style="border: none;padding: 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 10px">ID number(for purchasing travel insurance)</div>-->
                        <!--<input data-role="none" id="activityRegister_txt_idNumber" type="text" style="width: 100%;height: 44px;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;padding: 14px;border: solid 1px #D2D2D2;border-radius: 0px"/>-->
                    <!--</div>-->
                <!--</li>-->
                <li style="border: none;padding: 10px;">
                    <!--活动注册按钮-->
                    <div>
                        <button id="btn_activityRegister" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
                            Register
                        </button>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>

<!--activity verify-->
<div data-role="page" id="activityVerify" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="activitiesVerfy_header_title" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: 8px auto auto;text-shadow: none;width: 110px; height: 20px;">Please verify</div>
        <div id="activityVerify_btn_cancel" class="ui-btn-left" style="height:38px;top: 0px;left: 10px;line-height: 38px;color: #ffffff;font-weight: normal;font-size: 14px;">Cancel</div>
        <div id="activityVerify_btn_edit" data-direction="slider" class="ui-btn-right" style="height:38px;top: 0px;right: 10px;line-height: 38px;color: #ffffff;font-weight: normal;font-size: 14px;">Edit</div>
    </div>
    <!--内容-->
    <div id="activityVerify_content" data-role="content" style="padding: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch;">
        <div>
            <ul id="activityVerify_list" data-role="listview" style="width: 94%; height:auto; margin: 10px auto 10px auto;background-color: #ffffff">
                <!--<li style="width:100%;  padding: 0; border: none;">-->
                    <!--<!--标题图-->
                    <!--<div style="width:100%;padding: 20px 10px 10px 10px;background-color: rgb(101,153,193);">-->
                        <!--<div style="white-space:normal;font-weight: normal;font-size: 18px;color: #ffffff;margin-bottom: 8px">Technology Exchange Opening</div>-->
                        <!--<div style="font-size: 11px;color: #ffffff;line-height: 18px;font-weight: normal">-->
                            <!--<span style="display: block">Start: 14:00,13 Aug 2014</span>-->
                            <!--<span style="display: block">End: 18:00,13 Aug 2014</span>-->
                            <!--<span style="display: block">Venue: Information of the venue</span>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<!--Staff ID-->
                    <!--<div style="width:100%;padding: 10px 10px 10px 10px">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">Staff ID</div>-->
                        <!--<div id="activityVerify_id" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">3124654653</div>-->
                    <!--</div>-->
                    <!--<!--English name-->
                    <!--<div style="width:100%;padding: 10px 10px 10px 10px">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">English name</div>-->
                        <!--<div id="activityVerify_englishName" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">James Zhang</div>-->
                    <!--</div>-->
                    <!--<!--Chinese name-->
                    <!--<div style="width:100%;padding: 10px 10px 10px 10px">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">Chinese name</div>-->
                        <!--<div id="activityVerify_chineseName" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">张大文</div>-->
                    <!--</div>-->
                    <!--<!--手机号码-->
                    <!--<div style="width:100%;padding: 10px 10px 10px 10px">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">Mobile number</div>-->
                        <!--<div id="activityVerify_mobileNumber" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">13575789426</div>-->
                    <!--</div>-->
                    <!--<!--ID number-->
                    <!--<div style="width:100%;padding: 10px 10px 10px 10px">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">ID number(for purchasing travel insurance)</div>-->
                        <!--<div id="activityVerify_idNumber" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">44010019900104321</div>-->
                    <!--</div>-->
                <!--</li>-->
                <li style="border: none;padding: 10px;">
                    <!--活动注册按钮-->
                    <div>
                        <button id="btn_activityVerify" style="background-color: #e6b012;color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
                            Confirm
                        </button>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>

<!--activity confirmation-->
<div data-role="page" id="activityConfirm" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
    <!--头部-->
    <div data-role="header" style="overflow:hidden; background: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
        <div id="activitiesConfirm_header_title" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: 8px auto auto;text-shadow: none;width: 110px; height: 20px;">Confirmation</div>
        <div id="activityConfirm_btn_ok" data-direction="slider" class="ui-btn-right" style="height:38px;top: 0px;right: 10px;line-height: 38px;color: #ffffff;font-weight: normal">OK</div>
    </div>
    <!--内容-->
    <div id="activityConfirm_content" data-role="content" style="padding: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
        <div>
            <ul id="activityConfirm_list" data-role="listview" style="width: 94%; height:auto; margin: 10px auto 10px auto;background-color: #ffffff">
                <!--<li style="width:100%;  padding: 0; border: none;">-->
                    <!--<!--标题图-->
                    <!--<div style="width:100%;padding: 20px 10px 10px 10px;background-color: rgb(101,153,193);">-->
                        <!--<div style="white-space:normal;font-weight: normal;font-size: 18px;color: #ffffff;margin-bottom: 8px">Technology Exchange Opening</div>-->
                        <!--<div style="font-size: 11px;color: #ffffff;line-height: 18px;font-weight: normal">-->
                            <!--<span style="display: block">Start: 14:00,13 Aug 2014</span>-->
                            <!--<span style="display: block">End: 18:00,13 Aug 2014</span>-->
                            <!--<span style="display: block">Venue: Information of the venue</span>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div style="border: solid 1px rgb(223,223,223);padding: 10px 10px 10px 3px;overflow: auto;margin: 10px">-->
                        <!--<div class="confirm_ok" style="float: left;display: inline;height: 38px;width: 38px">-->

                        <!--</div>-->
                        <!--<div style="display: inline;white-space: normal">-->
                            <!--Thank you very much for your registration!-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div style="padding: 10px 10px 5px 10px;">-->
                        <!--<!--Staff ID-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">Staff ID</div>-->
                        <!--<div id="activityConfirm_id" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">3124654653</div>-->
                    <!--</div>-->
                    <!--<!--English name-->
                    <!--<div style="padding: 10px 10px 5px 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">English name</div>-->
                        <!--<div id="activityConfirm_englishName" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">James Zhang</div>-->
                    <!--</div>-->
                    <!--<!--Chinese name-->
                    <!--<div style="padding: 10px 10px 5px 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">Chinese name</div>-->
                        <!--<div id="activityConfirm_chineseName" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">张大文</div>-->
                    <!--</div>-->
                    <!--<!--手机号码-->
                    <!--<div style="padding: 10px 10px 5px 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">Mobile number</div>-->
                        <!--<div id="activityConfirm_mobileNumber" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">13575789426</div>-->
                    <!--</div>-->
                    <!--<!--ID number-->
                    <!--<div style="padding: 10px 10px 5px 10px;">-->
                        <!--<div style="font-family: Arial;font-size: 12px;font-weight: normal;color: #404040;margin-bottom: 6px">ID number(for purchasing travel insurance)</div>-->
                        <!--<div id="activityConfirm_idNumber" style="width: 100%;height: auto;font-family: Arial;font-size: 12px;font-weight: bold;color: #404040;">44010019900104321</div>-->
                    <!--</div>-->
                <!--</li>-->
                <li style="border: none;padding: 10px;display: none">
                    <!--活动注册按钮-->
                    <div>
                        <button id="btn_activityAddCalendar" style="background-color: rgb(163,189,174);color: #ffffff;font-family: Arial;font-weight: bold;border-radius: 0px;width: 100%;height: 36px;font-size: 14px;border: 0px;padding: 0px;margin: 0px;text-shadow: none">
                            Add to Calendar
                        </button>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>

<!--活动Filter页面-->
<div data-role="page" id="activity_filter" style="background-image: url('images/image/bg_masterbg_2x.jpg');background-size: 400px;">
<!--头部-->
<div data-role="header" style="background-color: #f26647;height: 40px;display: -webkit-flex;display: flex;border: 1px solid rgb(242, 102, 71);">
    <div id="activitiesFilter_header_title" style="color: #ffffff;font-family: Arial;font-size: 18px;font-weight: normal;padding: 0px;margin: 8px auto auto;text-shadow: none; height: 20px;width:109px">Activity filter</div>
    <div id="activity_filter_btn_menu" alt="" class="ui-btn-left menu" style="width:38px;height:38px;top: 0px"></div>
    <span id="activity_filter_btn_applay" class="ui-btn-right" style="font-family: Arial;margin: auto;padding: 8px;font-size: 14px;color: #ffffff;font-weight: normal;text-shadow: none;">Apply</span>
</div>

<!--内容-->
<div id="activity_filter_content" data-role="content" style="width:100%; height:0px; padding: 0px;margin: 0px;overflow-y: scroll;-webkit-overflow-scrolling:touch">
    <div>
        <ul id="activityFilter_ul" data-role="listview" data-inset="true" style="border-radius: 0px;margin: 0px;background-color: #ffffff;">
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-a" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="font-family: Arial;font-size: 14px;width: 87%;height: auto;margin: auto;padding-left: 18%">
                        All
                    </div>
                    <div class="ui-block-b" style="width: 13%;height: auto;margin-top: 0px;">
                        <div id="activity_all_check" name="sbox2" class="nor">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div class="filter_tags" style="background-color: #6699c2;">COMM</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Communications
                        </div>
                    </div>
                    <div class="ui-block-c ui-checkbox" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Communications">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div  class="filter_tags" style="background-color: #a3d963;">CS</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Corporate Sustainability
                        </div>
                    </div>
                    <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Corporate Sustainability">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div class="filter_tags" style="background-color: #e8e012;">FIN</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Finance
                        </div>
                    </div>
                    <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Finance">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div class="filter_tags" style="background-color: #a3bdad;">GTU</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Trade Union
                        </div>
                    </div>
                    <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Trade Union">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div class="filter_tags" style="background-color: #e6b012;">HR</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Human Resources
                        </div>
                    </div>
                    <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Human Resources">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div class="filter_tags" style="background-color: #75c2bd;">INNO</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Innovation
                        </div>
                    </div>
                    <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Innovation">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div class="filter_tags" style="background-color: #8d7c81;">OPS</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Center Operations
                        </div>
                    </div>
                    <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Center Operations">
                        </div>
                    </div>
                </div>
            </li>
            <li style="padding: 0px;height: 40px;">
                <div class="ui-grid-b" style="height: 40px;line-height: 40px">
                    <div class="ui-block-a" style="width: 15%;height: auto;margin-top: 13px;overflow: auto">
                        <div class="filter_tags" style="background-color: #7a77ae;">TD</div>
                    </div>
                    <div class="ui-block-b" style="width: 72%;height: auto;margin: auto;">
                        <div style="font-family: Arial;font-size: 14px;margin-left: 10px">
                            Technical Development
                        </div>
                    </div>
                    <div class="ui-block-c" style="width: 13%;height: auto;margin-top: 0px;">
                        <div name="sbox" class="nor" alt="Technical Development">
                        </div>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>

<!--活动filter页面push推出-->
<div data-role="panel" id="activity_filter_panel_menu" data-position="left" data-display="overlay" style="width: 100%;background-color: rgba(0,0,0,0)">
    <div style="float: left;width: 85%">
        <ul id="filter_activity_push_ul" data-role="listview" style="background-color: #f26647">
            <li style="background-color: #f26647;color: #ffffff;padding: 12px 0px 32px 15px;height: 82px;">
                <div>
                    <div class="push_title"></div>
                </div>
                <span style="font-family: Arial;font-size: 12px;font-weight: normal;text-shadow: none">Welcome, <span id="filter_activity_push_username" style="text-shadow: none"></span></span>
            </li>
            <li id="filter_activity_push_newsroom" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                <div class="ui-grid-a" style="height:100%;line-height: 52px">
                    <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                        <div class="push_newsroom" style="width: 38px;height: 38px;margin-top: 7px"></div>
                    </div>
                    <div class="ui-block-b" style="width: 80%">
                        <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Newsroom</span>
                    </div>
                </div>
            </li>
            <li id="filter_activity_push_activities" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                <div class="ui-grid-a" style="height:100%;line-height: 52px">
                    <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                        <div class="push_activities" style="width: 38px;height: 38px;margin-top: 7px"></div>
                    </div>
                    <div class="ui-block-b" style="width: 80%">
                        <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Activities</span>
                    </div>
                </div>
            </li>
			<li id="filter_activity_push_AR" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                <div class="ui-grid-a" style="height:100%;line-height: 52px">
                    <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                        <div class="push_discovery" style="width: 38px;height: 38px;margin-top: 7px"></div>
                    </div>
                    <div class="ui-block-b" style="width: 80%">
                        <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Discovery</span>
                    </div>
                </div>
            </li>
            <li id="filter_activity_push_Laisee" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                <div class="ui-grid-a" style="height:100%;line-height: 52px">
                    <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                        <div class="push_mylaisee" style="width: 38px;height: 38px;margin-top:7px"></div>
                    </div>
                    <div class="ui-block-b" style="width: 80%">
                        <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Green Laisee</span>
                    </div>
                </div>
            </li>
            <li id="filter_activity_push_setting" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 52px">
                <div class="ui-grid-a" style="height:100%;line-height: 52px">
                    <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                        <div class="push_settings" style="width: 38px;height: 38px;margin-top: 7px"></div>
                    </div>
                    <div class="ui-block-b" style="width: 80%">
                        <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;text-shadow: none">Settings</span>
                    </div>
                </div>
            </li>
            <li id="filter_activity_auto_height" style="background-color: #f26647;color: #ffffff;padding: 25px 0px 25px 0px">

            </li>
            <li id="filter_activity_push_logon" style="background-color: #f26647;color: #ffffff;padding: 0px;font-family: Arial;font-size: 16px;font-weight: normal;height: 64px" >
                <div class="ui-grid-a" style="height:100%;line-height: 52px">
                    <div class="ui-block-a" style="width: 20%;margin: 0 auto;height:100%;">
                        <div class="push_logOff" style="width: 38px;height: 38px;margin-top: 12px"></div>
                    </div>
                    <div class="ui-block-b" style="width: 80%;height:100%;display:-webkit-flex;display:flex;">
                        <span style="font-family: Arial;font-size: 16px;font-weight: normal;line-height: 3;margin:auto 0px;text-shadow: none">Log off</span>
                    </div>
                </div>
            </li>
        </ul>
    </div>
    <div class="push_nees_opacity" style="float: right;width: 15%;background-color: rgba(0,0,0,0.5)">

    </div>
</div>

</div>

</body>
</html>